
<!doctype html>
<html>
<head>
    <meta charset="utf-8">
    <title>英雄联盟周年历史</title>
    <link rel="shortcut icon" href="favicon.ico" type="image/x-icon"/>
    <link href='http://fonts.googleapis.com/css?family=Days+One' rel='stylesheet' type='text/css'>
    <link rel="stylesheet" href="css/style.css">
    <style>
        #nav{
            width: 100%;
            height: 56px;
            position: absolute;
            top: 0;
            left: 0;

            background: #000000;
        }
        #nav ul{
            width: 700px;
            height: 40px;
            float: right;
        }
        #nav ul li{
            width: 14%;
            height: 40px;
            list-style: none;
            float: left;
            line-height: 40px;
            text-align: center;
        }
        #nav ul li a{color: white;
            font-family: 微软雅黑;
            font-size: 20px;
        }
        #nav ul li a:hover{
            color:burlywood;
        }
        #nav ul li:hover{background: #00ab88}
    </style>
</head>
<body>
<div id="nav">
    <ul>
        <li ><a href="../index.html">首页</a></li>
        <li><a href="../index_pic_html/index_pic.html">英雄资料</a></li>
        <li><a href="../5anniversary/5anniversary.html">周年盛典</a></li>
        <li style="background:#00ab88"><a href="lol_hero.html">周年历史</a></li>
        <li><a href="../pic_video_html/pic_video.html">英雄信仰</a></li>
        <li><a href="../responsive/myheart.html">个人中心</a></li>
        <li><a href="../LOL_download/LOL_download.html">更多</a></li>
    </ul>
</div>
<header class="header">
    <hgroup>
        <h1>众人教育</h1>
        <h2>15网工丶吴俊杰</h2>
    </hgroup>
</header>

<section class="demo">

    <dl class="list nigiri">
        <dt>英雄联盟3周年盛典</dt>
        <dd><a href="#">时间：2014年9月6号——7号</a></dd>
        <dd><a href="#">城市：上海</a></dd>
        <dd><a href="#">地点：梅赛德斯奔驰文化中心</a></dd>
        <dd><a href="#">时间：2014年9月6号——7号</a></dd>
        <dd><a href="#">城市：上海</a></dd>
        <dd><a href="#">地点：梅赛德斯奔驰文化中心</a></dd>
        <dd><a href="#">时间：2014年9月6号——7号</a></dd>
        <dd><a href="#">城市：上海</a></dd>
        <dd><a href="#">地点：梅赛德斯奔驰文化中心</a></dd>
        <dd><a href="#">15网工丶吴俊杰</a></dd>
    </dl>

    <dl class="list maki">
        <dt>英雄联盟5周年盛典</dt>
        <dd><a href="#">时间：20116年8月26号——27号</a></dd>
        <dd><a href="#">城市：广州</a></dd>
        <dd><a href="#">地点：国际体育演艺中心</a></dd>
        <dd><a href="#">时间：20116年8月26号——27号</a></dd>
        <dd><a href="#">城市：广州</a></dd>
        <dd><a href="#">地点：国际体育演艺中心</a></dd>
        <dd><a href="#">时间：20116年8月26号——27号</a></dd>
        <dd><a href="#">城市：广州</a></dd>
        <dd><a href="#">地点：国际体育演艺中心</a></dd>
        <dd><a href="#">15网工丶吴俊杰</a></dd>
    </dl>

    <dl class="list sashimi">
        <dt>英雄联盟4周年盛典</dt>
        <dd><a href="#">时间：2015年9月4号——5号</a></dd>
        <dd><a href="#">城市：深圳</a></dd>
        <dd><a href="#">地点："春茧"体育馆</a></dd>
        <dd><a href="#">时间：2015年9月4号——5号</a></dd>
        <dd><a href="#">城市：深圳</a></dd>
        <dd><a href="#">地点："春茧"体育馆</a></dd>
        <dd><a href="#">时间：2015年9月4号——5号</a></dd>
        <dd><a href="#">城市：深圳</a></dd>
        <dd><a href="#">地点："春茧"体育馆</a></dd>
        <dd><a href="#">15网工丶吴俊杰</a></dd>
    </dl>

    <a href="#" class="toggle">下拉/折叠</a>

</section>

<div class="warning">
    <div class="message">
        <h1>动态效果不被支持(</h1>
        <p>我不能判断您的浏览器是否支持，请重新加载文件或者试试其他浏览器 </p>
    </div>
</div>



<script src="js/jquery-1.9.1.js"></script>
<script src="js/lol_hero.js"></script>
<script>

    // The `enabled` flag will be `false` if CSS 3D isn't available

    if ( $.fn.makisu.enabled ) {

        var $sashimi = $( '.sashimi' );
        var $nigiri = $( '.nigiri' );
        var $maki = $( '.maki' );

        // Create Makisus

        $nigiri.makisu({
            selector: 'dd',
            overlap: 0.85,
            speed: 1.7
        });

        $maki.makisu({
            selector: 'dd',
            overlap: 0.6,
            speed: 0.85
        });

        $sashimi.makisu({
            selector: 'dd',
            overlap: 0.2,
            speed: 0.5
        });

        // Open all

        $( '.list' ).makisu( 'open' );

        // Toggle on click

        $( '.toggle' ).on( 'click', function() {
            $( '.list' ).makisu( 'toggle' );
        });

        // Disable all links

        $( '.demo a' ).click( function( event ) {
            event.preventDefault();
        });

    } else {

        $( '.warning' ).show();
    }

</script>
</body>
</html>